module MC.View {
    export class MCform {
        public constructor(el: string) {
          //  window.test = {};
            this.elID = el;
            this.elObj = $(el);
            mui.init();
            this.init();
            this.getdata();
        }

        public children: any = {};
        private elID: string;
        private elObj: JQuery;

        private vue: any;

        private $(select: string) {
            return $(this.elID).find(select);
        }

        ///private zw = new MC.View.ZhiweiDiv();
        private init() {
            console.log("通用表单");
            //  return;

            if (this.$('MCtitle')[0]) {
                this.MCtitle();
            }
            if (this.$('MCselect.mctag')[0]) {
                this.select_mctag();
            }


            let listmodelList = this.$('[mcname]');
            let formListObj = {};
            for (let i = 0; i < listmodelList.length; i++) {
                let one = $(listmodelList[i]);
                let name = one.attr('mcname');
                let mval = one.attr('defaultval');
            //    one.attr("mcname", name);//='aaaaaa';
                one.attr("v-model", name);//='aaaaaa';
                if(!mval||mval==''){
                    mval=one.attr('value');
                }
                if(mval==='[]'){
                    mval=[];
                }
                formListObj[name] = mval;
            }

            let vue = new Vue({
                el: this.elID,
                data: formListObj
            });
            this.vue = vue;
            let zujian = this.$('[mcname]');
            for (let i = 0; i < zujian.length; i++) {
                this.children[$(zujian[i]).attr('mcname')] = zujian[i];
            }

            if (this.$('.zhiweiSelectDiv')[0]) {
                this.zhiweiSelectDiv();
            }
            if (this.$('MCselect.mctag')[0]) {
                this.selectMctag();
            }
            //  test.formListObj = formListObj;
            //   test.vue = vue;
            /*setInterval(() => {
                console.log(formListObj, formListObj.imgDetails, formListObj.sex);
            }, 1000 * 5);*/
            if (this.$('.mui-numbox')[0]) {
                this.mui_numbox();
            }

            if (this.$('productPictureDiv')[0]) {
                MC.UI.productPictureDiv(vue);
            }
            this.$("[type=submit]").on("click", () => {
                //console.log("submit");
                this.clicksubmit();
            });
            setTimeout(() => {
                 this.vue.$forceUpdate();
            }, 1);
        }

        private MCtitle() {
            let MCtitle = this.$('MCtitle');
            let returns: any = MCtitle.attr('return');
            if (!returns || returns == '') {
                returns = '';
            }
            let subtitle: any = MCtitle.attr('subtitle');
            if (!subtitle || subtitle == '') {
                subtitle = '';
            }
            let subtitleOn: any = MCtitle.attr('subtitleOn');
            if (!subtitleOn || subtitleOn == '') {
                subtitleOn = null;
            }
            let title = MCtitle.text();
            H5.TitleBar.create(title, subtitle, returns);
            H5.TitleBar.fubiaoti = () => {
                if (subtitleOn) {
                    let run = new Function(subtitleOn);
                    run.apply(MCtitle[0]);
                }

            };
        }

        private select_mctag() {
            let listmodel = this.$('select.mctag');
        }

        private zhiweiSelectDiv() {
            let listmodel = this.$('.zhiweiSelectDiv');

            let zw = new MC.View.ZhiweiDiv();
            /* listmodel.on('touchstart',(eve: any)=>{
                  eve.preventDefault();
                  eve.stopPropagation();
                 return false;
             });*/
            listmodel.on('click touchstart', (eve: any) => {
                let target = eve.target;
                eve.preventDefault();
                eve.stopPropagation();
                let zhiweiid = $(target).attr('zhiweiid');
                zw.selectVal((val: any) => {
                    //console.log(val);
                    this.vue[zhiweiid] = val.id;
                    $(target).val(val.erji);//val.menu + '.' +
                    target.dispatchEvent(new Event('input'));
                });
                return false;
            });
        }


        private selectMctag() {
            let listmodel = this.$('MCselect.mctag');
            for (let w = 0; w < listmodel.length; w++) {
                let selectone = $(listmodel[w]);
                let option = selectone.find('option');
                let list = [];
                let defaultval = selectone.attr('defaultval');
                if (!defaultval) {
                    defaultval = $(option[0]).attr('value');
                } else {
                    defaultval = '0';
                }
                let defaulttitle = '...';
                for (let i = 0; i < option.length; i++) {
                    let one = $(option[i]);
                    list.push({
                        value: one.attr('value'),
                        text: one.text()
                    });
                    if (one.attr('value') == defaultval) {
                        defaulttitle = one.text();
                    }
                }
                listmodel[w].vue = this.vue;
                // selectone.attr("disabled",'disabled');
                MC.UI.muiPopPicker.bind(listmodel[w], list, (val: any) => {
                    console.log(val);
                    //   selectone.find("option[value="+val+"]").attr("selected",true);
                });
                //   selectone.text(defaulttitle);
                selectone.val(defaultval);
            }

        }

        /**
         * 数字控件
         * */
        private mui_numbox() {
            let bu = this.$('.mui-numbox');
            bu.on('click', (eve: any) => {
              //  console.log(bu, eve);
                let target = $(eve.currentTarget);
                let valueobj = target.find('[mcname]');
                let mcname = valueobj.attr('mcname');
                this.vue[mcname] = valueobj.val();
            });
        }

        /**
         * 表单获取接口内容后,对接口内容进行解析
         * */
        public formgetJson(obj:any){

        }

        /**
         *如果返回false,则不继续提交,返回true继续提交
         * */
        public submitVerification() {
            return true;
        }
        /**
         * 提交成功后调用
         * */
        public Success(data:any){
            console.log(data);
        }

        /**
         * 点击了按钮
         * */
        private clicksubmit() {
            this.vue.$forceUpdate();
            let action = $(this.elID).attr('action');
            if(!action){
                return;
            }
            //console.log('点击了审核按钮',action);
            if (!this.submitVerification()) {
                return;
            }
            let list = {};
            for (let key in this.children) {
                let value = this.vue[key];
                list[key] = value;
                // console.log(key);
                if (!this.isfuhebiaozhun(key, value)) {
                    return;
                }
            }
            MC.apiD(action,this.dataTo(list),(json:any)=>{
                this.Success(json);
            });
            console.log(list);
        }
        /**
         * 转换下传入的数据,使之符合接口的格式
         * */
        public dataTo(list:any){
            return list;
        }
        /**
         * 判断输入框值是否符合标准
         * */
        private isfuhebiaozhun(key: string, value: any) {
            let obj = $(this.children[key]);
            let par = obj.parent();
            let must = par.find('.Must');
            if (!must[0]) {
                return true;
            }
            if (!value || value == '') {//||value==0
                let text = $(par.find('label,h5')[0]).text();
                MC.msg.alert(text + "必须不能为空");
                par.addClass("vnull");
                return false;
            } else {
                par.removeClass("vnull");
                return true
            }
        }

        /**
         * 从服务器获取信息
         * */
        public getdata(){
            let fromapi=this.elObj.attr('fromapi');
            if(!fromapi){
                return;
            }
            let par={};
            let fromapiId=this.elObj.attr("fromapiId");
            if(fromapiId&&fromapiId!==''){
                 par[fromapiId]=MC.OS.query(fromapiId);
            }
           /* if(!fromapiId||fromapiId==''){
                return;
            }


            if(par[fromapiId]==''){
                return;
            }*/
          //  let getlis=MC.OS.query();
            MC.apiD(fromapi,par,(data:any)=>{
                this.formgetJson(data);
                for(let k in data){
                    this.vue[k]=data[k];
                }
            })
        }
    }
}


///
/*

MC.UI.Mui.loadbase();
let gangweiobj={
    job_name:'',
    contact_name:''

};
let vue= new Vue({
    el: '#gangwei',
    data: gangweiobj
});
 setInterval(()=>{
     console.log(gangweiobj.contact_name);
},100);
$('#job_name').on('click',()=>{
    this.zw.selectVal(function (val:any) {
        console.log(val);
        gangweiobj.job_name=val.menu+'.'+val.erji;
    });
});
*/